<!-- 我的页面 -->
<template>
	<view style="height: 100%">
		<!-- 用户头像昵称 -->
		<view id="background_top" @click="myInformation">
			<view @tap="login">
				<image :src="userInfo.avatarUrl" mode="aspectFill"></image>
				<view id="name">{{ userInfo.nickName }}</view>
			</view>
		</view>

		<!-- 菜单 -->
		<view id="menu">
			<view id="menu_item" @click="myInformation" hover-class="button_spread">
				<view>
					<image src="../../static/images/gerenzhongxin-wodexinxi.png"></image>
					<view>我的信息</view>
				</view>
				<view>></view>
			</view>
			<view id="menu_item" hover-class="button_spread" @click="myGoods(2)">
				<view>
					<image src="../../static/images/shoucang.png"></image>
					<view>我的购买</view>
				</view>
				<view>></view>
			</view>
			<view id="menu_item" hover-class="button_spread" @click="myGoods(1)">
				<view>
					<image src="../../static/images/lie-b.png"></image>
					<view>我的发布</view>
				</view>
				<view>></view>
			</view>
		</view>
	</view>
</template>

<script>
	import user from "@/api/user.js"
	export default {
		data() {
			return {
				userInfo: {
					id: '',
					phone: '',
					avatarUrl: '',
					nickName: ''
				},
				wxImg: ""
			};
		},
		methods: {
			myInformation() {
				uni.navigateTo({
					url: "/pages/my/myInformation"
				})
			},
			myGoods(id) {
				console.log('我的交易信息');
				uni.navigateTo({
					url: "/pages/myGoods/myGoods?id=" + id
				})
			},
		},

		//每次进入都发生一次事件
		onShow() {
			const that = this
			const wximg = uni.getStorageSync("wximg")
			if (wximg != 0) {
				console.log(wximg);
				console.log("这里的微信图片有了")
				user.userInfor().then(function(res) {

					that.userInfo.avatarUrl = wximg
					that.userInfo.nickName = res.data.nickName

				})

			} else {
				console.log("唉，又错了");
				user.userInfor().then(function(res) {

					wx.getUserInfo({
						success(res) {
							console.log("获取头像信息")
							that.userInfo.avatarUrl = res.userInfo.avatarUrl
							console.log("获取昵称")
							that.userInfo.nickName = res.userInfo.nickName
						}
					})

				})
			}
		},
		onLoad() {

		}
	}
</script>
<style>
	/* 用户头像昵称 */
	#background_top {
		width: 100%;
		height: 100rpx;
		display: flex;
		justify-content: center;
		border-radius: 0rpx 0rpx 50% 50%;
		background-color: #ff9224;
	}

	#background_top view:nth-child(1) {
		width: 150rpx;
		margin-top: 20rpx;
	}

	#background_top view:nth-child(1) image {
		width: 150rpx;
		height: 150rpx;
		border-radius: 50%;

	}

	#name {
		white-space: nowrap;
		text-overflow: ellipsis;
		overflow: hidden;
		margin-top: 20rpx;
		text-align: center;
		font-weight: bold;
	}

	/* 菜单 */
	#menu {
		margin: 200rpx 30rpx 0rpx 30rpx;
		border: 1rpx #ff9224 solid;
		border-radius: 15rpx;
		padding: 15rpx 15rpx 25rpx 15rpx;
		box-shadow: 2rpx 2rpx 5rpx #ff9224;
	}

	#menu_item {
		margin: 30rpx 30rpx 0rpx 40rpx;
		display: flex;
		justify-content: space-between;
		border-bottom: 3rpx #ff9224 solid;
		padding-right: 15rpx;
	}

	#menu_item view {
		display: flex;
		height: 50rpx;
		font-size: 25rpx;
		line-height: 50rpx;
		font-weight: bold;
		text-align: center;
	}

	#menu_item view image {
		margin-right: 25rpx;
		width: 45rpx;
		height: 45rpx;
	}

	/* 点击效果 */
	.button_spread {
		background-color: #e8e8e8;
		color: #fff;
		border-radius: 15rpx;
	}
</style>